<template>
  <div class="c-p c-fs20 c-bg-white" ref="bgHeight">
    <div class="c-w100 theme-bg-gradient" :class="(userType == 0 || userType == 3) && (info.vipType == 1 ||info.vipType == 2 || info.vipType == 4) ? 'c-hh240' : 'c-hh190'">
      <div class="c-pa c-p-t28 c-ph24 c-w100 clearfix">
        <div class="c-flex-row">
          <img :src="$addXossFilter(info.avatar, require('@/assets/defult_head.png'))" alt="" class="c-ww80 c-hh80 c-brp50">
          <div class="c-fc-white c-pl20 c-w0 c-flex-grow1">
            <div class="c-flex-row c-aligni-center">
              <div class="c-fs30 c-text-ellipsis1 c-pr10 maxw240">{{info.nickname}}</div>
              <identity-com :vipType="info.vipType"></identity-com>
            </div>
            <div class="c-flex-row c-justify-sb">
              <div class="c-pt10 c-w48">
                <div class="c-ws-n c-text-ellipsis1">真名:{{!!info.realName ? info.realName : "--"}}</div>
                <!-- 直接关系 || 服务商 员工 || 间接关系 且 允许看手机号 -->
                <div class="c-pt16" v-if="userTypeShowMobile">TEL:{{!!info.mobile && isShowMobile ? info.mobile : "--"}}</div>
              </div>
              <div class="c-pt10 c-w48">
                <div class="c-ws-n c-text-ellipsis1">推荐人: {{info.refereeName}}</div>
                <div class="c-pt16" @click="more">全部信息<span class="iconfont c-pl8 c-fs20">&#xe836;</span></div>
              </div>
            </div>
          </div>
        </div>
        <div class="c-bg-white c-br12 c-pv36 c-ph24 c-mt20 boxShow" v-if="(userType == 0 || userType ==3 ) && (info.vipType == 1 || info.vipType == 2 || info.vipType == 4)">
          <div class="c-flex-row c-w100 c-pb16">
            <div class="c-fs22 c-fc-xblack c-w100 c-flex-row c-justify-sb c-aligni-center">
              <div class="">设置为员工:</div>
              <div v-if="!!setStaffTime">
                <div class="c-fs18 c-p">
                  <div class="c-ww300 c-hh30 c-lh30 c-br4" :class="stringValue == 1 ? 'c-bg-f2' : 'c-bg-green c-opacity10'"></div>
                  <div class="c-pa c-p-l10 c-p-t2 c-flex-row c-aligni-center" :class="stringValue == 1 ? 'c-fc-sgray' : 'c-fc-green'"><i class="iconfont c-pr5 c-fs18">&#xe6b1;</i>{{setStaffTime}}{{stringValue == 1 ? '设为' : '取消'}}员工</div>
                </div>
              </div>
              <x-switch :themeColor="$getThemeColor()" title="" :value-map="[0, 1]" v-model="stringValue" prevent-default @on-click="changeSwitch" class="switch"></x-switch>
            </div>
          </div>
          <div class="c-fs22 c-fc-xblack c-pt12 c-w100 c-flex-row c-justify-sb c-aligni-center" v-if="isShowSet || stringValue ==1">
            <div class="c-w60">员工奖学金:</div>
            <div class="c-w40 c-flex-row c-aligni-center c-textAlign-r">
              <input type="number" step="0.01" min="0" @keyup="num= num.match(/\d+(\.\d{0,2})?/) ? num.match(/\d+(\.\d{0,2})?/)[0] : ''" class="c-w40 c-fs24 c-lh c-textAlign-c needsclick bd-bd1"
                @focus="inputFocus" ref="input" v-model="num" />%
              <div class="c-w60 c-textAlign-r">
                <button class="c-w80 c-bd0 theme-bg c-fs20 c-fc-white c-pv10 c-ph24 c-lh c-br24 c-ws-n c-textAlign-c" @click="setStaff(1)">提交</button>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="masker" v-if="isShowMasker" @click="closeMasker"></div>
    <open-modal :openModal="openModal" @closeModal="closeModal">
      <div class="c-ph24 c-bg-white c-pz1000 c-br-tr10 c-br-tl10 c-pb40 c-fc-xblack c-fs22">
        <div class="c-fs28 c-fw-b c-textAlign-c c-pt30 c-fc-xblack c-p">
          全部信息
          <span class="iconfont c-fs18 c-fc-gray c-pa c-p-t40 c-p-r8" @click="closeModal">&#xe8fd;</span>
        </div>
        <div class="c-pv24 c-bd-b1"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">姓名</span>{{info.nickname}}</div>
        <div class="c-pv24 c-bd-b1" v-if="!!info.realName"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">真名</span>{{info.realName}}</div>
        <div class="c-pv24 c-bd-b1" v-if="custNameMap[info.vipType]">
          <div class="c-ww180 c-pr40 c-inlineblack c-fc-gray">身份:</div>
          <span>{{custNameMap[info.vipType]}}</span>
        </div>
        <div class="c-pv24 c-bd-b1"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">推荐人</span>{{info.refereeName}}</div>
        <div class="c-pv24 c-bd-b1"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">ID</span>{{info.userId}}</div>
        <div class="c-pv24 c-bd-b1" v-if="info.mobile && userTypeShowMobile && isShowMobile"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">TEL</span>{{info.mobile}}</div>
        <div class="c-pv24 c-bd-b1" v-if="info.mobile && !!info.bindMobileAt && userTypeShowMobile && isShowMobile"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">手机绑定时间</span>{{info.bindMobileAt}}</div>
        <div class="c-pv24 c-bd-b1 theme-fc"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">最近活跃</span>{{info.activeTime}}</div>
        <div class="c-pv24 c-bd-b1" v-if="!!info.bindAt"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">绑定时间</span>{{info.bindAt}}</div>
        <div class="c-pv24 c-bd-b1" v-if="info.expirationDate"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">绑定到期</span>{{info.expirationDate}}</div>
        <div class="c-pv24 c-bd-b1" v-if="!!info.createdAt"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">注册时间</span>{{info.createdAt}}</div>
        <div class="c-pv24" :class="!!info.province ? 'c-bd-b1' : ''"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">注册来源</span>{{info.fromChannel == 1 ? "公众号" : info.fromChannel == 2 ? "小程序" : info.fromChannel == 3 ? "安卓APP" : info.fromChannel == 4 ? "苹果APP" : info.fromChannel == 5 ? "web/pc" : (info.fromChannel == 10 || info.fromChannel == 14) ? "抖音" : (info.fromChannel == 13 || info.fromChannel == 127) ? "手机号注册" : info.fromChannel == 20 ? "手动导入": "未知"}}
        </div>
        <div class="c-pv24" v-if="!!info.province"><span class="c-ww180 c-pr40 c-inlineblack c-fc-gray">地址</span>{{info.province}}{{info.city}}{{info.area}}</div>
      </div>
    </open-modal>
    <!-- //数据统计 -->
    <div class="c-ph24 c-bg-white c-pb10"
      :class="(userType == 0 || userType == 3) && (info.vipType == 1 ||info.vipType == 2 || info.vipType == 4) ? isShowSet ==true || stringValue ==1 ? 'pt164' : 'pt94' : 'c-pt24'">
      <div class="c-fs26">
        <div>数据统计</div>
        <div class="c-flex-row c-mt20">
          <div v-for="(item, index) in dataTab" :key="index" class="c-pv10 c-ww140 c-fs20 c-textAlign-c c-mr8 c-br4" :class="dataTabIndex == index ? 'theme-bg c-fc-white' : 'c-bg-f2'"
            @click="changeNum(index)">
            {{item}}
          </div>
        </div>
      </div>
      <!-- //统计 -->
      <div class="c-ph20 c-pv40 c-br12 c-box-shadow5 c-mt30">
        <div class="c-flex-row c-bd-b1-f6 c-pb24">
          <div class="c-flex-grow1 c-mr4">
            <div class="c-fs26 c-textAlign-l c-lh36">{{agentData.consumeMoney}}</div>
            <div class="c-fs20 c-textAlign-l c-fc-gray c-lh28 c-mt4">直推业绩(元)</div>
          </div>
          <div class="c-flex-grow1 c-mr4">
            <div class="c-fs26 c-textAlign-l c-lh36">{{agentData.income}}</div>
            <div class="c-fs20 c-textAlign-l c-fc-gray c-lh28 c-mt4">收益(元)</div>
          </div>
          <div class="c-flex-grow1">
            <div class="c-fs26 c-textAlign-l c-lh36">{{agentData.refereeIncrNum}}</div>
            <div class="c-fs20 c-textAlign-l c-fc-gray c-lh28 c-mt4">新增直推</div>
          </div>
        </div>

        <div class="c-flex-row c-pt24">
          <div class="c-mr4 c-justify-start">
            <div class="c-fs26 c-textAlign-l c-lh36">{{agentData.orderNum}}</div>
            <div class="c-fs20 c-textAlign-l c-fc-gray c-lh28 c-mt4">直推订单</div>
          </div>
        </div>
      </div>
    </div>
    <div class="c-ph24 c-bg-white c-pt40 c-pb30">
      <div class="c-fs26">
        <div>团队情况</div>
        <div class="c-flex-row c-mt20">
          <div v-for="(item, index) in levelType" :key="index" class="c-pv10 c-ww140 c-fs20 c-textAlign-c c-mr8 c-br4" :class="level == index + 1 ? 'theme-bg c-fc-white' : 'c-bg-f2'"
            @click="changeLevel(index + 1)">
            {{item}}
          </div>
        </div>
      </div>
    </div>
    <div class="c-w100 c-bg-white" :class="type == 1 ? 'c-hh52' : type == 2 ? 'c-hh120' : type == 3 ? 'c-hh190' : ''" v-if="type != 0 && isScrollTop" ref="unTop"></div>
    <div ref="classTitle" class="c-w100 c-bg-white" :class="isScrollTop && type != 0 ? 'c-pf c-p-t0 c-pt72 c-pz10' : ''">
      <div class="c-bg-white" :class="type == 1 ? '' : 'c-pb20'">
        <div class="c-pv12 c-fs20 c-ph24 c-bg-sgray c-flex-row c-justify-sb" @click="changeType(1)">
          <div>服务商({{provideNum}})</div>
          <div class="iconfont c-fs18">{{type == 1 ? '&#xe6ab;' : '&#xe6a9;'}}</div>
        </div>
      </div>
      <div class="c-bg-white" v-show="type != 1" :class="type == 2 ? '' : 'c-pb20'">
        <div class="c-pv12 c-fs20 c-ph24 c-bg-sgray c-flex-row c-justify-sb" @click="changeType(2)">
          <div>会员({{memberNum}})</div>
          <div class="iconfont c-fs18">{{type == 2 ? '&#xe6ab;' : '&#xe6a9;'}}</div>
        </div>
      </div>
      <div class="c-bg-white" v-show="type != 1 && type != 2" :class="type == 3 ? '' : 'c-pb20'">
        <div class="c-pv12 c-fs20 c-ph24 c-bg-sgray c-flex-row c-justify-sb" @click="changeType(3)">
          <div>普通用户({{normalNum}})</div>
          <div class="iconfont c-fs18">{{type == 3 ? '&#xe6ab;' : '&#xe6a9;'}}</div>
        </div>
      </div>
    </div>
    <div class="c-bg-white c-pt10 c-pb30" v-if="type != 0">
      <div v-for="(item,index) in classmateList" :key="index" class="c-ph24 c-pt20">
        <div class="c-br10 boxShow c-ph20 c-pt20 c-pb30 c-flex-row c-bg-white">
          <img :src="$addXossFilter(item.avatar, require('@/assets/defult_head.png'))" alt="" class="c-ww80 c-hh80 c-brp50">
          <div class="c-pl20 c-w100">
            <div class="c-flex-row c-aligni-center c-justify-start">
              <div class="c-fw-b c-text-ellipsis1" :class="item.vipType==1 ? 'maxw360' : item.vipType==2 || item.vipType==4 ? 'maxw400' : 'c-maxw200'">{{item.nickname}}</div>
              <identity-com :vipType="item.vipType"></identity-com>
            </div>
            <div class="c-pt16">真名: {{!!item.realName ? item.realName : '--'}}</div>
            <div class="c-pt16" v-if="allInfo && allInfo.enableShowClassMatePhone">电话: {{!!item.mobile ? item.mobile : '--'}}</div>
            <div class="c-pt16 c-flex-row c-justify-sb">
              <div>ID：{{item.userId}}</div>
            </div>
          </div>
        </div>
      </div>
      <loading-status-tem :dataStatus="dataStatus" :noDataText="'暂无记录'" v-if="dataStatus == 'NO_DATA'"></loading-status-tem>
    </div>
    <div class="c-bg-white c-pb20" v-show="type == 1">
      <div class="c-pv12 c-fs20 c-ph24 c-bg-sgray c-flex-row c-justify-sb" @click="changeType(2)">
        <div>会员({{memberNum}})</div>
        <div class="iconfont c-fs18">{{type == 2 ? '&#xe6ab;' : '&#xe6a9;'}}</div>
      </div>
    </div>
    <div class="c-bg-white c-pb20" v-show="type == 1 || type == 2">
      <div class="c-pv12 c-fs20 c-ph24 c-bg-sgray c-flex-row c-justify-sb" @click="changeType(3)">
        <div>普通用户({{normalNum}})</div>
        <div class="iconfont c-fs18">{{type == 3 ? '&#xe6ab;' : '&#xe6a9;'}}</div>
      </div>
    </div>
    <loading-status-tem :dataStatus="dataStatus" :noDataText="'暂无记录'" v-if="dataStatus != 'NO_DATA' && type != 0"></loading-status-tem>
  </div>
</template>

<script>
import { utilJs } from "@/utils/common.js";
import loadingStatusTem from "@/components/templates/common/loadingStatusTem.vue";
import openModal from "@/components/templates/common/openModal.vue";
import identityCom from "@/components/templates/common/identityCom.vue";
import { XSwitch } from 'ckjrweb-mp-ui/src/components/index';
const PAGE_SIZE = 10;
export default {
  name: 'ClassmateDetail',
  components: {
    openModal,
    loadingStatusTem,
    XSwitch,
    identityCom
  },
  props: [],
  beforeCreate() {
  },
  created() {
    utilJs.appShare(this);
  },
  data() {
    return {
      theme: localStorage.getItem("colorName") ? localStorage.getItem("colorName") : 'mb5_default',
      companyAuth: JSON.parse(localStorage.getItem("companyAuth")),
      customName: JSON.parse(localStorage.getItem("customName")),
      enableLookIndirectMobile: JSON.parse(localStorage.getItem("enableLookIndirectMobile")),
      userId: "",
      classmateDetail: [],
      info: "",
      isShowMasker: false,
      openModal: false,
      levelType: ["直接同学"],
      level: 1, //1直接推荐 2间接推荐
      // userType: ["服务商", "会员", "普通用户"],
      page: 1,
      type: 1, //1服务商 2会员 3普通用户
      classmateList: [],
      dataStatus: 'HAS_MORE_DATA',
      custNameMap: {},
      provideNum: 0,
      memberNum: 0,
      normalNum: 0,
      stringValue: 0,
      num: 0, // 员工奖学金
      isShowSet: false,
      setStaffTime: "",
      userType: "",
      dataTabIndex: 0,
      dataTab: ["7天", "本月", "今年"],
      isScrollTop: false,
      isShowMobile: '', //是否暂时手机号
      agentData: {}, //统计数据
      isClick: false,
      allInfo: {},
    }
  },
  mounted() {
  },
  computed: {
    userTypeShowMobile() {
      let isShow = this.userType == 0 || this.userType >= 2 || (this.userType == 1 && this.isShowMobile == 1);
      return isShow;
    }
  },
  watch: {
    num(val) {
      // 监听员工奖学金
      if (isNaN(val)) {
        this.num = null
      } else {
        this.num = val
      }
    }
  },
  filters: {
  },
  methods: {
    //获取统计数据
    getAgentTeamDatas(tabIndex) {
      utilJs.getMethod(global.apiurl + `Analyse/getAgentTeamDatas/${this.userId}?timeType=${tabIndex}`, res => {
        this.agentData = res.data
      })
    },
    //数据统计tab
    changeNum(num) {
      this.dataTabIndex = num
      this.getAgentTeamDatas(num + 1)
    },
    getClassmateDetail() {
      if (this.dataStatus == 'LOADING') {
        return;
      }
      this.dataStatus = 'LOADING';
      utilJs.getMethod(global.apiurl + "members/followerList?userId=" + this.userId + "&level=" + this.level + "&page=" + this.page + "&type=" + this.type, res => {
        if (this.page == 1) {
          this.classmateList = res.data.data;
        } else {
          this.classmateList = [...this.classmateList, ...res.data.data];
        }
        this.provideNum = res.provideNum;
        this.memberNum = res.memberNum;
        this.normalNum = res.normalNum;
        if (this.page == 1 && !res.data.data.length) {
          this.dataStatus = 'NO_DATA';
        } else if (res.data.data.length < PAGE_SIZE) {
          this.dataStatus = 'NO_MORE_DATA';
        } else {
          this.dataStatus = 'HAS_MORE_DATA';
          this.page++;
        }
        // if (res.data.total * 1 == this.classmateList.length) {
        //   this.dataStatus = res.data.total * 1 == 0 ? 'NO_DATA' : 'NO_MORE_DATA';
        // } else {
        //   this.dataStatus = 'HAS_MORE_DATA';
        //   this.page++;
        // }
      }, failRes => {
        this.dataStatus = 'DATA_ERROR';
      })
    },
    more() {
      this.isShowMasker = true;
      this.openModal = true;
    },
    closeMasker() {
      this.isShowMasker = false;
      this.openModal = false;
    },
    closeModal() {
      this.openModal = false;
      this.isShowMasker = false;
    },
    changeLevel(index) {
      if (this.level == index) {
        return
      }
      this.level = index;
      this.getClassmateDetail();
    },
    changeType(index) {
      this.classmateList = []
      if (this.type == index) {
        this.type = 0
        this.page = 1
        this.isScrollTop = false
        return
      }
      this.page = 1
      this.type = index;
      this.getClassmateDetail();
    },
    changeSwitch: function (val) {
      if (val) {
        this.stringValue = 1;
        this.isShowSet = true;
      } else {
        this.stringValue = 0;
        this.isShowSet = false;
        this.num = 0;
      }
      this.setStaff(0);
    },
    inputFocus() {
      this.num = '';
    },
    setStaff(isSubmit) {
      let isStaff;
      if (this.stringValue <= 0) {
        isStaff = false
      } else {
        isStaff = true
      }
      if (Number(this.num) > 0 && this.stringValue < 1) {
        this.$showCjToast({
          text: "请先设置成员工再设置员工奖学金！",
          type: 'warn',
        });
        this.num = 0
        return;
      }
      // 后台开启按现金百分比 就要判断设置的员工比例不能小于升级VIP第一级抽成比例
      if (this.info.ratioType == 1 && isStaff) {
        // 判断取哪个比例 VIP svip哪个有值取哪个
        let ratio = this.info.initStaffRatio; //this.info.upgradeMembershipL1Ratio;
        // 设置员工时默认给第一级分销比例
        this.num = this.num > 0 ? this.num : (isSubmit == 0 ? ratio : 0);
        // 判断
        // if (this.num < ratio) {
        //   this.$showCjToast({
        //     text: "员工的抽成比例不能低于一级推广员比例：" + ratio,
        //     type: 'warn',
        //     time: 2000
        //   });
        //   return;
        // }
        const userId = localStorage.getItem('userId')
        const vipType = localStorage.getItem(`vipType${userId}`)
        const { newAgencyUpgradeMembershipL1Ratio = 0, newCooUpgradeMembershipL1Ratio = 0, newAgentUpgradeMembershipL1Ratio = 0, newPartnerUpgradeMembershipL1Ratio = 0, newBranchUpgradeMembershipL1Ratio = 0, isCustomStaff = 0 } = this.info
        localStorage.getItem("companyId")
        let isCorrectNum = true
        let maxRatio = 0
        // 定制商家 员工分成比例不能大于推荐人身份所能获得的第一级分成比例
        if ([3, 5, 6, 7, 8].includes(vipType) && isCustomStaff) {
          const vipAction = {
            3: () => {
              if (this.num > newAgentUpgradeMembershipL1Ratio) {
                isCorrectNum = false
                maxRatio = newAgentUpgradeMembershipL1Ratio
              }
            },
            5: () => {
              if (this.num > newPartnerUpgradeMembershipL1Ratio) {
                isCorrectNum = false
                maxRatio = newPartnerUpgradeMembershipL1Ratio
              }
            },
            6: () => {
              if (this.num > newBranchUpgradeMembershipL1Ratio) {
                isCorrectNum = false
                maxRatio = newBranchUpgradeMembershipL1Ratio
              }
            },
            7: () => {
              if (this.num > newCooUpgradeMembershipL1Ratio) {
                isCorrectNum = false
                maxRatio = newCooUpgradeMembershipL1Ratio
              }
            },
            8: () => {
              if (this.num > newAgencyUpgradeMembershipL1Ratio) {
                isCorrectNum = false
                maxRatio = newAgencyUpgradeMembershipL1Ratio
              }
            }
          }
          vipAction[vipType]()
          if (!isCorrectNum) {
            this.$showCjToast({
              text: `设置的比例值不能高于${maxRatio}%`,
              type: 'warn',
            })
            return;
          }
        }
        if (this.num > 100) {
          this.$showCjToast({
            text: "员工的抽成比例不能大于100%",
            type: 'warn',
          });
          return;
        }
      } else if (this.info.ratioType == 2 && isStaff) { // 后台开启按积分值 就直接判断员工比例在0-100之间
        if (this.num < 0 || this.num > 100) {
          this.$showCjToast({
            text: "范围在0-100之间的整数",
            type: 'warn',
          });
          return;
        }
      }
      if (this.isClick) {
        return;
      }
      this.isClick = true;
      let $this = this;
      utilJs.postMethod(global.apiurl + 'members/setStaff', { userId: this.userId, isStaff: isStaff, staffRatio: this.num * 1, isSubmit: isSubmit }, (res) => {
        this.$showCjToast({
          text: "设置成功",
          type: 'success',
        });
        $this.setStaffTime = res.setStaffTime;
        $this.isClick = false;
      }, failRes => {
        this.isClick = false;
      });
    },
    getInfo() {
      utilJs.getMethod(global.apiurl + "members/followerDetail?userId=" + this.userId, res => {
        this.allInfo = res;
        this.info = res.info;
        this.isShowMobile = res.showMobile;
        this.stringValue = res.info.isStaff;
        if (res.info.isStaff == 1) {
          this.num = res.info.staffRatio;
        }
        this.setStaffTime = res.info.setStaffTime;
        if (res.showLevel == 1) {
          this.levelType = ["直接同学"]
        } else {
          this.levelType = ['直接同学', '间接同学']
        }
      })
    },
    checkTime: function (bindAt, expirationDate) {
      let ba = bindAt && utilJs.getTimeByDate(bindAt);
      let e = expirationDate && utilJs.getTimeByDate(expirationDate);
      let nt = (new Date()).getTime();
      if (bindAt && expirationDate) {
        if (nt <= e && ba < e) {
          return 1; //未过期
        } else {
          return -1; //已过期
        }
      } else {
        return 0; //永久有效
      }
    },
    goSpread: function () {
      this.$routerGo(this, "push", { path: "/homePage/spread/spreadIndex" });
    },
    wechatShare: function () {
      let title = `升级${this.customName.serviceProviderName}`;
      let shareImg = 'https://kposshzcdn.ckjr001.com/admin/material/9_material_admin/image/assets/i/wap/common/provider.png';
      let shareUrl = `${window.location.href.split("#")[0]}#/homePage/agent/agentIndex?refereeId=${localStorage.getItem("userId")}`;
      let shareDesc = "点击查看详情";
      utilJs.wechatConfig(shareUrl, title, shareImg, shareDesc, function () { }, true);
    },
    //手机端分享
    appShare: function () {
      let title = `升级${this.customName.serviceProviderName}`;
      let shareImg = 'https://kposshzcdn.ckjr001.com/admin/material/9_material_admin/image/assets/i/wap/common/provider.png';
      let shareUrl = `${window.location.href.split("#")[0]}#/homePage/agent/agentIndex?refereeId=${localStorage.getItem("userId")}`;
      let shareDesc = "点击查看详情";
      utilJs.appShareTrue(title, shareImg, shareUrl, shareDesc);
    },
    windowScrollFunction() {
      if (!this.isScrollTop) {
        if (this.$refs.classTitle.getBoundingClientRect().top <= 45 && !this.$refs.unTop) {
          this.$nextTick(() => {
            this.isScrollTop = true
          })
        }
      } else if (this.isScrollTop && this.$refs.unTop && this.$refs.classTitle.getBoundingClientRect().top == 0) {
        if (this.$refs.unTop.getBoundingClientRect().top > 45) {
          this.$nextTick(() => {
            this.isScrollTop = false
          })
        }
      }
      utilJs.handleLoading(() => {
        if (this.dataStatus == 'HAS_MORE_DATA' && this.classmateList.length > 0) {
          this.getClassmateDetail();
        }
      });
    },
  },
  activated() {
    setDocumentTitle("团员详情");// eslint-disable-line
    this.dataStatus = 'HAS_MORE_DATA';
    this.userType = this.$route.query.userType;
    this.companyAuth = JSON.parse(localStorage.getItem("companyAuth"));
    this.info = "";
    this.level = 1;
    this.page = 1;
    this.type = 1;
    this.classmateList = [];
    this.openModal = false;
    this.isShowMasker = false;
    this.levelType = ["直接同学"]
    this.custNameMap = utilJs.getCustNameMap();
    this.provideNum = 0;
    this.memberNum = 0;
    this.normalNum = 0;
    this.isShowSet = false;
    this.setStaffTime = "";
    this.isShowMobile = "";
    this.dataTabIndex = 0
    this.agentData = {}
    this.allInfo = {}
    this.isClick = false
    // 复制链接时隐藏userId
    let teamId = localStorage.getItem('teamUserId')
    this.userId = this.$route.query.userId ? this.$route.query.userId : teamId;
    if (this.$route.query.userId) {
      localStorage.setItem('teamUserId', this.userId)
      this.$routerGo(this, "replace", {path: `/homePage/agent/classmateDetail?userType=${this.userType}`})
    } else if (!this.$route.query.userId && !localStorage.getItem('teamUserId')) {
      this.$routerGo(this, "replace", { path: '/' })
    }
    if (this.$route.query.userId || localStorage.getItem('teamUserId')) {
      this.getInfo();
      this.getClassmateDetail();
      this.getAgentTeamDatas(1)
      this.$nextTick(res => {
        this.$refs.bgHeight.style.minHeight = `${window.screen.availHeight}px`;
      })
      this.wechatShare();
      window.addEventListener('scroll', this.windowScrollFunction);
    }
  },
  deactivated() {
    this.dataStatus = 'NO_MORE_DATA';
    window.removeEventListener('scroll', this.windowScrollFunction);
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.boxShow {
  box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.05);
}
.clearfix:after {
  content: "020";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix {
  /* 触发 hasLayout */
  zoom: 1;
}
.pt94 {
  padding-top: 2.35rem;
}
.pt164 {
  padding-top: 4.1rem;
}
.masker {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
}
.maxw240 {
  max-width: 6rem;
}
.maxw360 {
  max-width: 9rem;
}
.maxw400 {
  max-width: 10rem;
}
.c-p-t2 {
  top: 0.05rem;
}
.bd-bd1 {
  border: none;
  border-bottom: 1px solid #999;
}
.switch >>> .vux-x-switch-overlay {
  height: 30px !important;
}
</style>